<script setup lang="ts">
// 设置默认值
withDefaults(
  // 接收父组件传值
  defineProps<{
    childMoney: number
    car?: string
    house?: string
  }>(),
  { car: '奥迪', house: '别墅' }
)

// 通知父组件方法
const emits = defineEmits<{
  // 自定义事件
  (e: 'changeMoney', money: number): void
  (e: 'changeCar', car: string): void
  (e: 'changeHouse', house: string): void
}>()
</script>

<template>
  <div class="child">
    <h3>我是子组件</h3>
    <div>钱包：{{ childMoney }}元</div>
    <button @click="emits('changeMoney', 100)">赚钱啦~</button>
    <hr />
    <div>车子：{{ car }}</div>
    <button @click="emits('changeCar', '奔驰')">换车啦~</button>
    <hr />
    <div>房子：{{ house }}</div>
    <button @click="emits('changeHouse', '大平层')">换房啦~</button>
  </div>
</template>

<style scoped>
.child {
  background-color: pink;
  width: 300px;
  height: 300px;
}
</style>
